<template>
  <el-dialog title="创建存单"
             :visible.sync="dialogForm"
             width="1200px">
    <el-form :inline="true"
             ref="form"
             :model="form"
             class="add-form"
             label-width="110px">
      <h3>基础信息</h3>
      <hr />
      <el-row>
        <el-col :span="8"
                class="el-height"><span class="labels">存单号:</span>{{form.stockBillNo}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">车船号:</span>{{form.transhipNo}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">品名:</span>{{form.cargoName}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">材质:</span>{{form.material}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">规格:</span>{{form.normStr}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">生产厂家:</span>{{form.madeBy}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">管理方式:</span>{{form.manageWay | _filterManagement}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">计量方式:</span>{{form.measureWay | _filterMeterStyle}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">入库方式:</span>{{form.inWayName}}</el-col>
      </el-row>
      <h3>详细信息</h3>
      <hr />
      <el-row>
        <el-col :span="8"
                class="el-height"><span class="labels">验收件数(件):</span>{{form.checkAcceptNum}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">验收数量(支):</span>{{form.checkAcceptCount}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">验收重量(吨):</span>{{form.checkAcceptWeight}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">上账件数(件):</span>{{form.checkAcceptNum}}</el-col>
        <el-col :span="8"
                class="el-height"><span class="labels">上账数量(支):</span>{{form.checkAcceptCount}}</el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="上账重量(吨)"
                        prop="detailWeight">
            <el-input type="text"
                      v-model="form.detailWeight"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="货主"
                        prop="cargoOwnerId">
            <auto-search-name v-model="form.cargoOwnerId"
                              placeholder="请选择"
                              @selectId="v=>form.cargoOwnerId=v"
                              :name="form.cargoOwnerName"></auto-search-name>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="结算单位"
                        prop="settleAccountId">
            <auto-search-customer v-model="form.settleAccountId"
                                  @selectName="v=>form.settleAccountName=v"></auto-search-customer>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="备注"
                        prop="remark">
            <el-input type="text"
                      v-model="form.remark"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-table :data="form.detailVoList"
                border
                stripe
                max-height="550">
        <el-table-column type="expand"
                         width="30">
          <template slot-scope="props">
            <el-form label-position="left"
                     inline
                     class="demo-table-expand">
              <el-col :span="6"
                      class="table-expand-style">
                <el-form-item label="捆包号">
                  <span>{{ props.row.baleNo}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6"
                      class="table-expand-style">
                <el-form-item label="炉批号">
                  <span>{{ props.row.stoveNo}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6"
                      class="table-expand-style">
                <el-form-item label="车牌号">
                  <span>{{ props.row.carNumber}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6"
                      class="table-expand-style">
                <el-form-item label="作业点">
                  <span>{{ props.row.jobPointCode}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6"
                      class="table-expand-style">
                <el-form-item label="物资ID">
                  <span>{{ props.row.inventoryId}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6"
                      class="table-expand-style">
                <el-form-item label="验收附加信息">
                  <span>{{ props.row.fileUrl}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6"
                      class="table-expand-style">
                <el-form-item label="验收备注">
                  <span>{{ props.row.remark }}</span>
                </el-form-item>
              </el-col>

              <el-col :span="6"
                      class="table-expand-style">
                <el-form-item label="复核添加信息">
                  <span>{{ props.row.failedReason }}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6"
                      class="table-expand-style">
                <el-form-item label="复核备注">
                  <span>{{ props.row.lbsWeight }}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6"
                      class="table-expand-style">
                <el-form-item label="验收人">
                  <span>{{ props.row.lbsWeight }}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6"
                      class="table-expand-style">
                <el-form-item label="验收时间">
                  <span>{{ props.row.lbsWeight }}</span>
                </el-form-item>
              </el-col>
            </el-form>
          </template>
        </el-table-column>
        <el-table-column label="序号"
                         type="index"
                         width="50"></el-table-column>
        <el-table-column prop="checkAcceptNo"
                         label="验收单号"
                         width="100"></el-table-column>
        <el-table-column prop="trackingNo"
                         label="跟踪号"
                         width="80"></el-table-column>
        <el-table-column prop="ifSmall"
                         label="是否小件"
                         width="80">
          <template slot-scope="scope">
            {{ scope.row.ifSmall | _filterTrueOrFalse }}
          </template>
        </el-table-column>
        <el-table-column prop="lbsTimes"
                         label="磅次"
                         width="50"></el-table-column>
        <el-table-column prop="lbsWeight"
                         label="合磅重量"
                         width="80"></el-table-column>
        <el-table-column prop="checkAcceptWeight"
                         label="验收重量"
                         width="80"></el-table-column>
        <el-table-column prop="checkAcceptCount"
                         label="数量"
                         width="60"></el-table-column>
        <el-table-column prop="tagWeight"
                         label="标牌重量"
                         width="80"></el-table-column>
        <el-table-column prop="rulerWeight"
                         label="检尺重量"
                         width="80"></el-table-column>
        <el-table-column prop="netWeight"
                         label="净重"
                         width="50"></el-table-column>
        <el-table-column prop="netWeight"
                         label="毛重"
                         width="50"></el-table-column>
        <el-table-column prop="roomName"
                         label="库房"
                         width="50"></el-table-column>
        <el-table-column prop="spanNo"
                         label="跨数"
                         width="50"></el-table-column>
        <el-table-column prop="aulaNo"
                         label="间数"
                         width="50"></el-table-column>
        <el-table-column prop="rowNo"
                         label="排位"
                         width="50"></el-table-column>
        <el-table-column prop="stackNo"
                         label="垛位"
                         width="50"></el-table-column>
        <el-table-column prop="tierNo"
                         label="层高"
                         width="50"></el-table-column>
      </el-table>
    </el-form>
    <div slot="footer"
         class="dialog-footer">
      <el-button type="primary"
                 @click="handleSave">保 存</el-button>
      <el-button type="primary"
                 @click="handleSubmit">提 交</el-button>
      <el-button @click="dialogForm = false">返 回</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { addDepositReceipt } from '@/api/enter/depositReceipt'
import autoSearchName from '@/components/autocomplete/autoSearchName' //货主组件
import autoSearchCustomer from '@/components/autocomplete/autoSearchCustomer'

export default {
  name: 'addDepositReceiptForm',
  components: {
    autoSearchName,
    autoSearchCustomer
  },
  data() {
    return {
      form: this.clearForm(),
      isEdit: false,
      dialogForm: false
    }
  },
  methods: {
    clearForm() {
      return {}
    },
    //保存
    handleSave() {
      this.$refs.form.validate(valid => {
        if (valid) {
          this.form.type = 1
          this.form.sumNum = this.form.checkAcceptNum //验收件数(件)
          this.form.sumCount = this.form.checkAcceptCount //验收数量(件)
          this.form.sumWeight = this.form.checkAcceptWeight //验收重量(件)
          this.form.detailNum = this.form.checkAcceptNum //上账件数(件)
          this.form.detailCount = this.form.checkAcceptCount //验收数量(件)
          addDepositReceipt(this.form).then(res => {
            this.$message({ message: '新增成功!', type: 'success' })
            this.dialogForm = false
            this.$emit('load')
          })
        } else {
          this.$message({
            message: '请检查表单',
            type: 'error'
          })
        }
      })
    },
    //提交
    handleSubmit() {
      this.$refs.form.validate(valid => {
        if (valid) {
          this.form.type = 2
          this.form.sumNum = this.form.checkAcceptNum //验收件数(件)
          this.form.sumCount = this.form.checkAcceptCount //验收数量(件)
          this.form.sumWeight = this.form.checkAcceptWeight //验收重量(件)
          this.form.detailNum = this.form.checkAcceptNum //上账件数(件)
          this.form.detailCount = this.form.checkAcceptCount //验收数量(件)
          addDepositReceipt(this.form).then(res => {
            this.$message({ message: '提交成功!', type: 'success' })
            this.dialogForm = false
            this.$emit('load')
          })
        } else {
          this.$message({
            message: '请检查表单',
            type: 'error'
          })
        }
      })
    },
    handleRemove() {
      if (this.form.factors.length === 1) {
        this.$message({ message: '至少需要一条数据!', type: 'error' })
      } else {
        this.form.factors.splice(index, 1)
      }
    }
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.el-height {
  margin: 10px 0;
}
h3 {
  margin: 10px 0;
}
.labels {
  margin-right: 5px;
}
</style>
